<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>消息</title>
		<script src="js/mui.min.js"></script>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		
	</head>
	<body class="ff">
		<header class="mui-bar mui-bar-nav">
		    <h1 class="mui-title">消息</h1>
		</header>
		<nav class="mui-bar mui-bar-tab">
		    <a class="mui-tab-item1 " href="index.html"> 
		        <span class="mui-icon "><img src="images/tab_index01.png"/></span>
		        <span class="mui-tab-label">拍拍拍</span>
		    </a>
		    <a class="mui-tab-item1" href="indexRelease.html">
		        <span class="mui-icon "><img src="images/tab_index02.png"/></span>
		        <span class="mui-tab-label">发布</span>
		    </a>
		    <a class="mui-tab-item1 mui-active" href="msg.html">
		        <span class="mui-icon "><img src="images/tab_index03.png"/></span>
		        <span class="mui-tab-label">消息</span>
		    </a>
		    <a class="mui-tab-item1" href="my.html">
		        <span class="mui-icon"><img src="images/tab_index04.png"/></span>
		        <span class="mui-tab-label">我的</span>
		    </a>
		</nav>
		<div class="mui-content">
		    
			<div class="bg_ff">
				<div class="clearfix padding_12">
					<span class="bold font_15">推荐好友</span>
					<!-- <a href="javascript:void(0);" onclick="recommendFocus(page++)" class="right color_cd font_13">换一批</a> -->
				</div>
				<!-- <div class="tj_list">
					<dl class="tj_item">
						<dt><img src="images/headimg.png"/></dt>
						<dd>
							<p class="color_00 font_13">花儿乐队</p>
							<p class="color_8 font_13">吻合度95%</p>
						</dd>
					</dl>
					
				</div> -->
				<div class="swiper-container">
				    <div class="swiper-wrapper tj_list">
				      <div class="swiper-slide"></div>
				    </div>
					 <!-- <div class="swiper-pagination"></div> -->
			</div>
			<div class="mg_top15 bg_ff padding_12">
				<div class="msg_list">
					<dl class="clearfix">
						<a href="room.html?id=''" class="width100">
							<dt class=" left relative">
									<img class="msg_img" src="images/index_head.png"/>
							        <i class="badge absolute">80</i>
								
							</dt>
							<dd class="width70 left">
								<p class="clearfix mg_b10">
									<span class="left color_00">花儿乐队</span>	
									<span class="right color_6">15分钟前</span>	
								</p>
								<h5 class="color_2 mui-ellipsis-2 lin_25">疫情期间请大家少出门，勤洗手，戴口罩做好防范工作，不给国家添乱不给国家添乱不给国家添乱 </h5>
							</dd>
						</a>
					</dl>
					<dl class="clearfix">
						<dt class=" left relative">
							<a href="room.html" class="width100">
								<img class="msg_img" src="images/index_head.png"/>
						        <i class="badge absolute">80</i>
							</a>
						</dt>
						<dd class="width70 left">
							<p class="clearfix mg_b10">
								<span class="left color_00">花儿乐队</span>	
								<span class="right color_6">15分钟前</span>	
							</p>
							<h5 class="color_2 mui-ellipsis-2 lin_25">疫情期间请大家少出门，勤洗手，戴口罩做好防范工作，不给国家添乱不给国家添乱不给国家添乱 </h5>
						</dd>
					</dl>
				</div>
			</div>
		</div>
	
		
		
		
	</body>
    <script src="js/mui.js"></script>
	<script src="js/jquery-1.7.1.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
	<!--<script src="http://cdn.ronghub.com/RongIMLib-2.5.0.min.js"></script>-->
	<script src="https://cdn.ronghub.com/RongIMLib-2.5.5.min.js"></script>
	
	<script src="js/msg.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		
		mui.init()
		//好友推荐
		
		function recommendFocus(){
			$('.gif').show()
			$.ajax({
					type:'post',
					url:urlcom+'userCenter/recommendFocus',
					async:true,
					dataType:'json',
					data:{
						userId:localStorage.getItem('userId')
					},
					success:function(res){
						$('.gif').hide()
						var html = '';
							if(res.data.length){
								$.each(res.data, function(k,v) {
										html+=' <div class="swiper-slide"><dl class="tj_item">'+
											'<dt><a href="userData.html?id='+v.focusUserId+'&&workUserId='+v.focusUserId+'"><img src="'+v.headImg+'"/></a></dt>'+
											'<dd>'+
												'<p class="color_00 font_13  mui-ellipsis">'+v.name+'</p>'+
												'<p class="color_8 font_13">吻合度'+v.alignment*100+'%</p>'+
											'</dd>'+
										'</dl></div>'
									
									});
							$('.tj_list').html(html)
									var swiper = new Swiper('.swiper-container', {
									      slidesPerView: 4,
									      spaceBetween:0,
									      pagination: {
									        el: '.swiper-pagination',
									        clickable: true,
									      },
									    });
						}else{
							$('.tj_list').html('<p class="text-center padding_10">暂无好友</p>')
						}
						
					}
					
			    })
		}recommendFocus()
		var list = {}
		
		
	</script> 
</html>
	
